'use strict';
import React from "react";
import {View, StyleSheet, Text, ImageBackground, TouchableOpacityComponent, TouchableOpacity} from "react-native";

class LatestSubjectComponent extends React.Component {

    constructor(props) {
        super(props);
    }

    _onPressToDetail = (item) => {
        // console.log('专题详情');

        RouterHelper.navigate('专题','SubjectDetail',{subject_id:item.subject_id});
    };

    render() {
        const {item,index} = this.props;
        const width = SCREEN_WIDTH - 30;
        const height = width * 0.348;
        return (
            <TouchableOpacity onPress={() => this._onPressToDetail(item)}>
                <ImageBackground
                    style={[styles.imgBack,{width,height}]}
                    resizeMode={'cover'}
                    source={item.subject_picture ? {uri:`${ServicesApi.QI_NIU_LINK}${item.subject_picture}`} : null}
                >
                    <Text numberOfLines={1} style={styles.imgTitle}>{item.subject_title}</Text>
                </ImageBackground>
            </TouchableOpacity>

        );
    }
}

const styles = StyleSheet.create({
    imgBack: {
        marginTop: 10,
        borderRadius: 5,
        overflow: 'hidden',
        marginHorizontal: 15,
    },
    imgTitle: {
        fontSize: FontSize(14),
        color: "#ffffff",
        position: 'absolute',
        left: 16,
        bottom: 12,
    },
});

export default LatestSubjectComponent